<template>
    <div class="u-p-20">
        <el-card shadow="never">
            <div slot="header">
                <b class="u-f-16">
                    <span v-if="objForm.id">编辑</span>
                    <span v-else>添加</span>发现
                </b>
                <div class="u-right u-5mt">
                    <el-button type="success" size="small" icon="el-icon-document-checked" @click="submitForm('objForm')" v-if="hasPerm('goodsEditPost')">提交保存</el-button>
                    <el-button size="small" icon="el-icon-back" @click="$router.go(-1)">返回</el-button>
                </div>
            </div>
            <el-form :model="objForm" :rules="rules" ref="objForm" label-width="100px" class="u-form">
                <el-form-item label="绑定商品">
                    <el-input v-model="objForm.goods_id" placeholder="商品id" type="hidden" style="display: none;"></el-input>

                    <div v-if="objForm.goods_id>0">
                        <el-input v-model="objForm.goods_title" placeholder="商品标题" disabled></el-input>
                        <el-image style="max-width: 150px;"
                                  :src="objForm.goods_img"
                                  :data-src="objForm.goods_img"
                                  fit="cover"
                                  lazy>
                        </el-image>
                    </div>

                    <el-button type="text" @click="is_goods_show = true">选择商品</el-button>
                </el-form-item>

                <el-form-item label="标签">
                    <el-input v-model="objForm.label" placeholder="标签"></el-input>
                </el-form-item>

                <el-form-item label="相册图片" prop="photo">
                    <upload file-folder="photo" :file-arr="fileList1" list-type="picture-card" :limit="9" accept="image/jpeg,image/png"
                        tips="只能上传jpg/png文件，且不超过4MB" @getUploadFiles="goodsPhoto">
                    </upload>
                </el-form-item>

                <el-form-item label="文字内容">
                    <el-input type="textarea" v-model="objForm.text"></el-input>
                </el-form-item>

                <el-form-item label="收藏数">
                    <el-input v-model="objForm.collect_count" placeholder="收藏数"></el-input>
                </el-form-item>

                <el-form-item label="浏览数">
                    <el-input v-model="objForm.read_count" placeholder="浏览数"></el-input>
                </el-form-item>

                 <el-form-item label="点赞数">
                    <el-input v-model="objForm.up_count" placeholder="点赞数"></el-input>
                </el-form-item>

                <el-form-item label="是否上线" prop="status">
                    <el-switch
                      v-model="objForm.status"
                      active-color="#13ce66"
                      :active-value="1"
                      inactive-color="#666"
                      :inactive-value="2"
                      >
                    </el-switch>
                </el-form-item>



            </el-form>
        </el-card>

        <!-- 用户弹出框 -->
        <el-dialog
          title="提示"
          :visible.sync="is_user_show"
          width="60%">

          <Users :isprops="true" @user_select="user_select">

          </Users>

          <span slot="footer" class="dialog-footer">
            <el-button @click="is_user_show = false">取 消</el-button>
            <el-button type="primary" @click="is_user_show = false">确 定</el-button>
          </span>
        </el-dialog>

        <!-- 商品弹出框 -->
        <el-dialog
          title="提示"
          :visible.sync="is_goods_show"
          width="65%">

          <Goods :isprops="true" @goods_select="goods_select">

          </Goods>

          <span slot="footer" class="dialog-footer">
            <el-button @click="is_goods_show = false">取 消</el-button>
            <el-button type="primary" @click="is_goods_show = false">确 定</el-button>
          </span>
        </el-dialog>


    </div>
</template>

<script>
    import commonEdit from '@/mixins/common-edit'
    import Upload from '@/components/upload/upload'
    import Goods from '@/views/goods/list.vue'
    import Users from '@/views/user/list.vue'
    export default {
        components: {
            Upload,
            Goods,
            Users,
        },
        mixins: [commonEdit],
        data() {
            return {
                apiName: 'goodsFind',
                backRoute: 'goodsFindIndex',//成功跳转地址
                fileList1: [], //临时相册
                objForm: {
                    id: '',
                    goods_id: '',//商品id
                    photo: '',//相册
                    text: '',//文字内容
                    label: '',//标签
                    status:'',//状态
                    collect_count:'',//收藏数
                    read_count:'',//浏览数
                    up_count:'',//点赞数
                    
                    //临时
                    nick_name:'',
                    goods_title:'',
                    goods_img:'',
                },
                is_user_show:false,
                is_goods_show:false,
            }
        },
        methods: {
            goodsPhoto(files) {
                //相册上传回调
                this.fileList1 = files
                this.objForm.photo = "";
                for (var i = 0; i < files.length; i++) {
                    this.objForm.photo += this.objForm.photo == '' ? files[i].url : "," + files[i].url;
                }
            },
            afterGetInfo(){
                //初始化-获取编辑数据
                // window.console.log(this.objForm)
                for (var i = 0; i < this.objForm.photo.length; i++) {
                    this.fileList1.push({url:this.objForm.photo[i]});//相册
                }
            },
            user_select(row){
                //用户选择
                // window.console.log(row);
                this.objForm.user_id=row.id;
                this.objForm.nick_name=row.nick_name;
                this.is_user_show=false;//关闭弹框
            },
            goods_select(row){
                //商品选择
                // window.console.log(row);
                this.objForm.goods_id=row.id;
                this.objForm.goods_title=row.goods_title;
                this.objForm.goods_img=row.goods_img;
                this.is_goods_show=false;//关闭弹框
            }
        },

    }
</script>
